<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<title>模块资源</title>
<head th:replace="common/incHead :: incHead"></head>
<body class="ok-body-scroll console">
<div class="ok-body home">
    <div class="layui-row ">
        <div class="layui-col-md3">
            <div class="layui-col-md12">
                <div class="layui-card">
                    <div class="ok-card-body layui-form">
                        <select th:field="${sysSystem.id}" name="systemId" lay-filter="selectSystem" style="width:100%;">
                            <option th:each="item:${systems}" th:value="${item.id}" hassubinfo="true" th:text="${item.systemName}"></option>
                        </select>
                    </div>
                </div>
            </div>
            <div class="layui-col-md12">
                <div class="layui-card" layoutH="73">
                    <div class="layui-card-header">
                        <div class="ok-card-title">系统模块</div>
                    </div>
                    <div class="ok-card-body">
                        <ul class="folder-list" style="padding: 0">
                            <li th:each="item:${sysModels}" class="p-xxs">
                                <a th:if="${sysModel.id == item.id}" href="javascript:"><i class="layui-icon layui-icon-link"></i>
                                    <selection class="text-info">[[${item.modelSort}]]:[[${item.modelName}]]【[[${item.modelCode}]]】</selection>
                                </a>
                                <a th:if="${sysModel.id != item.id}" th:href="@{/sys/resource(sid=${sysSystem.id},mid=${item.id})}"><i class="layui-icon layui-icon-link"></i>
                                    <selection>[[${item.modelSort}]]:[[${item.modelName}]]【[[${item.modelCode}]]】</selection>
                                </a>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-col-md9 p-l-sm">
            <div class="layui-card">
                <div class="layui-card-header">
                    <div class="ok-card-title">
                        <div class="layui-btn-container p-t-xxs">
                            <button class="layui-btn layui-btn-sm layui-btn-warm" th:ljUrl="|/sys/resource/add?sid=${sid}&mid=${mid}&pid=0|" th:title="|添加模块资源:${sid}-${mid}|" ljWidth="1000px" target="ljOpenSubmit"><i
                                    class="layui-icon layui-icon-add-circle"></i>添加资源
                            </button>
                            <button class="layui-btn layui-btn-primary layui-border-orange layui-btn-sm pa-bar-cond">
                                <form class="layui-form layui-form-pane" lay-filter="pagerForm" id="pagerForm" action="/sys/resource" method="get">
                                    <input type="hidden" id="sid" name="sid" th:value="${sid}"/>
                                    <input type="hidden" id="mid" name="mid" th:value="${mid}"/>
                                    <div class="pull-left pa-bar-cond-input"><input placeholder="请输入资源ID" class="layui-input" type="text" name="fid" th:value="${fid}"></div>
                                    <div class="pull-left pa-bar-cond-icon btnPagerForm"><i class="layui-icon layui-icon-search "></i></div>
                                </form>
                            </button>
                            <button class="layui-btn layui-btn-sm layui-btn-normal pull-right btnPageRefresh" lay-event="reload"><i class="layui-icon layui-icon-search"></i>刷新页面</button>
                        </div>
                    </div>
                </div>
                <div class="ok-card-body">
                    <div class="layui-row ljLayTableBox">
                        <table class="layui-hide" id="indexTable" lay-filter="indexTable"></table>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div th:replace="common/incBottom :: incBottom"></div>
<script th:inline="javascript">
    /*<![CDATA[*/
    let oldSysId = [[${sysSystem.id}]];
    let indexData = [];
    /*[# th:replace="this::row(${sysResources},0)" ]*/
    /*[/]*/
    /*]]>*/
</script>
<script th:fragment="row(sysResourcesList,lv)" th:inline="javascript" th:remove="tag">
    /*[# th:each="item,itemStat:${sysResourcesList}"]*/
    indexData.push({
        id: [[${item.id}]],
        resType: [[${item.resType}]],
        upChild: [[${item.upChild}]],
        upFamily: [[${item.upFamily}]],
        resName: [[${item.resSort}]] + ':' + [[${item.resName}]],
        resUrl: [[${item.resUrl}]],
        resLimit: [[${item.resLimit}]],
        resIcon: [[${item.resIcon}]],
        resLevel: [[${lv}]],
        resLeft: [[${lv*15}]],
        dataStatus: [[${item.dataStatus}]],
        createTime: [[${@lj.date(item.createTime)}]]
    });
    /*[# th:unless="${#lists.isEmpty(item.childs)}" th:replace="this::row(${item.childs},${lv+1})" ]*/
    /*[/]*/
    /*[/]*/
</script>
<script th:inline="none">
    layui.use(["element", "jquery", "table", "form", "okLayer", "okPapper", "okUtils"], function () {
        let table = layui.table;
        let form = layui.form;
        let okPapper = layui.okPapper;
        let $ = layui.jquery;
        okLoading.close($);
        let okUtils = layui.okUtils;
        let config = okUtils.local("okConfig") || okConfig || {};
        table.render({
            elem: '#indexTable',
            data: indexData,
            height: 'full-98',
            page: false,
            limit: indexData.length,
            toolbar: false,
            size: config.tableSize,
            cols: [[
                {field: "id", title: "编号", fixed: "left", width: 100},
                {field: "resType", title: "资源类型", fixed: "left", width: 100, templet: "#resTypeTpl"},
                {field: "resIcon", title: "图标", align: "center", width: 60, templet: "<div><i class='{{d.resIcon}}'></i></div>"},
                {field: "resName", title: "资源名称", width: 200, templet: "#resNameTpl"},
                {field: "resUrl", title: "资源地址",},
                {field: "resLimit", title: "权限标识", width: 200},
                {title: "操作", width: 350, align: "center", fixed: "right", templet: "#operationTpl"}
            ]],
            done: function (res, curr, count) {
            }
        });
        okPapper.init();
        form.render();
        form.on('select(selectSystem)', function (data) {
            if (oldSysId != data.value) {
                window.location.href = "/sys/resource?sid=" + data.value;
            }
        });
    })
</script>
<!-- 默认统一操作模板 -->
<script type="text/html" id="operationTpl">
    <button class="layui-btn layui-btn-xs" title="资源详情:{{d.id}}" ljUrl="/sys/resource/detail?id={{d.id}}" ljWidth="1000px" target="ljOpenSubmit">
        <i class="layui-icon layui-icon-form"></i>详情
    </button>
    <button class="layui-btn layui-btn-xs layui-btn-normal" title="资源详情:{{d.id}}" th:ljUrl="|/sys/resource/add?pid={{d.id}}&sid=${sid}&mid=${mid}|" ljWidth="1000px" target="ljOpenSubmit">
        <i class="layui-icon layui-icon-add-circle"></i>添加
    </button>
    <button class="layui-btn layui-btn-xs layui-btn-warm" title="资源编辑:{{d.id}}" ljUrl="/sys/resource/edit?id={{d.id}}" ljWidth="1000px" target="ljOpenSubmit">
        <i class="layui-icon layui-icon-edit"></i>编辑
    </button>
    <button class="layui-btn layui-btn-xs layui-btn-danger" title="确认要删除该资源吗?" ljUrl="/sys/resource/del?id={{d.id}}" target="ljAjaxTodo">
        <i class="layui-icon layui-icon-delete"></i>删除
    </button>
    <button class="layui-btn layui-btn-xs layui-btn-checked" title="确认要匹配地址吗?" ljUrl="/sys/resource/match?id={{d.id}}" ljWidth="1000px" target="ljOpenCon">
        <i class="layui-icon layui-icon-transfer"></i>匹配
    </button>
</script>
<!-- 资源名称层级关系 -->
<script type="text/html" id="resNameTpl" th:inline="none">
    {{#  if(d.resType == 0){ }}
    <selection class="layui-font-green" style="padding-left:{{d.resLeft}}px"><i class="layui-icon layui-icon-layer"></i>&nbsp;&nbsp;{{d.resName}}</selection>

    {{#  } else if(d.resType == 1) { }}
    <selection class="layui-font-red" style="padding-left:{{d.resLeft}}px"><i class="layui-icon layui-icon-component"></i>&nbsp;&nbsp;{{d.resName}}</selection>

    {{#  } }}
</script>
<!-- DataStatus枚举模板 -->
<script type="text/html" id="resTypeTpl" th:inline="none">
    {{#  if(d.resType == 0){ }}
    <selection class="layui-font-green">页面</selection>

    {{#  } else if(d.resType == 1) { }}
    <selection class="layui-font-red">菜单</selection>

    {{#  } }}
</script>
</body>
</html>